import React from 'react'
import {
    EyeOutlined,
    TeamOutlined,
    LikeOutlined,
    ShopOutlined,
} from '@ant-design/icons'
import { useNavigate } from 'react-router-dom'
import { Button, } from 'antd'
// import '../resource/resource.css'

const LiveBroadcast = () => {
    const navigate = useNavigate()

    const toBack = () => {
        navigate('/broadcast')
    }
    return (
        <div className='broRoom'>
            <div className='bro_room_head'>
                <span>小可爱鸣儿直播间</span><span>护肤小达人教程</span>
            </div>
            <div className="broRoom_main">
                <div className='broRoom_left'>
                    <p><EyeOutlined /> 当前观看人数：234人</p>
                    <p><TeamOutlined /> 当前关注人数：32人</p>
                    <p><LikeOutlined /> 当前点赞人数：54人</p>
                    <p><ShopOutlined /> 当前下单人数：12人</p>
                </div>
                <div className='broRoom_right'>
                    <img src="https://img2.baidu.com/it/u=1729250424,3321747351&fm=26&fmt=auto" alt="" />
                    <div>
                        <Button type='primary' danger size='large'
                            onClick={() => { toBack() }}>返回</Button>
                        <Button danger size='large' style={{ backgroundColor: '#000' }}>强制关闭</Button>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default LiveBroadcast